/**
 * 属性：
 *  direction，方向
 *  elements，一组蛇节，所对应一组div元素
 */
/**
 * 规律：不断增加蛇头
 * 计算新蛇头的位置：
 *  1.若没有蛇头，新蛇头的位置是 0，0
 *  2.若有蛇头，根据方向来计算
 *    @right
 *    新蛇头的left位置 = 旧蛇头的left位置 + 20
 *    @left
 *    新蛇头的left位置 = 旧蛇头的left位置 - 20
 *    @up
 *    新蛇头的top位置 = 旧蛇头的top位置 - 20
 *    @down
 *    新蛇头的top位置 = 旧蛇头的top位置 + 20
 */
/**
 * 增加新蛇头：
 *  1.获取并计算新蛇头的位置
 *  2.检测是否有旧的蛇头，若有，把旧的蛇头变成身体
 *  3.创建一个新蛇头（创建一个div）
 *  4.把蛇头放到蛇组的最前面
 *  5.把蛇头放到地图中
 *  6.把新的位置给新的蛇头
 */
class Snake {
  constructor() {
    // 约定方向值：left right up down
    this.direction = 'right'
    // 蛇组（蛇头和蛇身），包含一组div元素,蛇头永远在数组最前面
    this.elements = []
  }
  // 计算新蛇头的位置
  getNewHeadLocation() {
    const $oldHead = this.elements[0]
    if ($oldHead === undefined) {
      return {left: 0, top: 0}
    } else {
      let x = $oldHead.position().left
      let y = $oldHead.position().top
      switch (this.direction) {
        case 'right':
          x = x + 20
          break;
        case 'left':
          x = x - 20
          break;
        case 'up':
          y = y - 20
          break;
        case 'down':
          y = y + 20
          break;
      }
      return {left: x, top: y}
    }
  }
  // 增加新蛇头
  insertNewHead() {
    const obj = this.getNewHeadLocation()
    const $oldHead = this.elements[0]
    if ($oldHead !== undefined) {
      $oldHead.removeClass().addClass('snake-body')
    }
    const $newHead = $('<div class="snake-head"></div>')
    this.elements.unshift($newHead)
    $newHead.appendTo('#map').css({
      left: obj.left,
      top: obj.top
    })
  }
  // 显示一条蛇
  showSnake() {
    for(let i = 0, len = 2; i <= len; i++) {
      this.insertNewHead()
    }
  }
  // 蛇移动
  move() {
    const $lastHead = this.elements.pop()
    $lastHead.remove();
    this.insertNewHead()
  }
  // 蛇是否撞墙死亡
  isDead() {
    const $snakeHead = this.elements[0]
    const left = $snakeHead.position().left
    const top = $snakeHead.position().top
    if (left < 0 || left >= $('#map').width() || top < 0 || top >= $('#map').height()) {
      return true
    } else {
      return false
    }
  }
  // 是否吃掉食物
  isEat(food) {
    // 蛇头位置和食物位置是否一致
    // 蛇头位置
    const $head = this.elements[0]
    const snakeLeft = $head.position().left
    const snakeTop = $head.position().top
    // 食物位置
    const foodLeft = food.x
    const foodTop = food.y
    // 判断位置是否一致
    if (snakeLeft === foodLeft && snakeTop === foodTop) {
      return true
    } else {
      return false
    }
  }
}